﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>无标题文档</title>
		<meta http-equiv="content-Type" content="text/html;charset=gb2312">
		<script src="../js/DateJS.js" type="text/javascript">
		</script>
	</head>
	<style type="text/css">
		body {
			background-color: #3994EE;
			text-align: center;
		}
		
		.div1 {
			background-image: url(img/1.png);
			width: 118px;
			height: 60px;
			color: #F6F6F6;
			float: left;
		}
		
		.div4 {
			background-image: url(img/3.png);
			width: 118px;
			height: 60px;
			color: #F6F6F6;
			float: left;
		}
		
		.div1:hover {
			background-image: url(img/2.png);
		}
		
		.div1:active {
			background-image: url(img/3.png);
		}
		
		a {
			text-decoration: none;
		}
		
		.div2 {
			height: 1px;
		}
		
		.div3 {
			border: #0CF solid 2px;
			height: 600px;
			margin-top: 65px;
			background-color: #E7FEED;
			text-align: center;
		}
		
		.table {
			margin: auto;
		}
		
		.input1 {
			background-color: #EEA6AD;
		}
	</style>

	<body>
		<div id="UpdateDepartment">
			<div class="div2">
				<table width="472" border="0" cellspacing="0" cellpadding="0">
					<tr>
						<td width="118">
							<a href="bmgl1.html">
								<div class="div1">
									<h4 style="text-align:center; line-height:0"> 新建部门 </h4>
								</div>
							</a>
						</td>
						<td width="118">
							<a href="bmgl2.html">
								<div class="div1">
									<h4 style="text-align:center; line-height:0"> 查询部门 </h4>
								</div>
							</a>
						</td>
						<td width="118">
							<a href="bmgl3.html">
								<div class="div1">
									<h4 style="text-align:center; line-height:0"> 查询部门员工 </h4>
								</div>
							</a>
						</td>
						<td width="118">
			</div>
			</td>

			</tr>
			</table>
		</div>
		<div class="div3">
			<h1>修改部门信息</h1>
			<div align="center">
				<form onsubmit="return false;">
					<table width="523px" height="240px" border="0" cellspacing="0" cellpadding="0">
						<tr>
							<td width="122" rowspan="8">&nbsp;</td>
							<td width="86" height="30" align="right" valign="middle">编号：</td>
							<td width="193" align="left" valign="middle">
								<input type="text" v-model="department_id" @blur="GetDepartmentById()" />
								<font color="#FF0000">*</font>
							</td>
							<td width="122">
								<font color="#FF0000" size="-1">输入id查询</font>
							</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">名称：</td>
							<td align="left" valign="middle">
								<input type="text" v-model="department_name">
								<font color="#FF0000"></font>
							</td>
							<td>&nbsp;</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">类型：</td>
							<td align="left" valign="middle">
								<select v-model="department_type">
									<option value="总公司">总公司</option>
									<option value="分公司">分公司</option>
								</select>
								<font color="#FF0000"></font>
							</td>
							<td>&nbsp;</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">电话：</td>
							<td align="left" valign="middle">
								<input type="text" v-model="department_tel">
								<font color="#FF0000"></font>
							</td>
							<td>&nbsp;</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">传真：</td>
							<td align="left" valign="middle">
								<input type="text" v-model="department_fax"></td>
							<td>&nbsp;</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">上级部门：</td>
							<td align="left" valign="middle">
								<input type="text" v-model="superior_department"></td>
							<td>&nbsp;</td>
						</tr>
						<tr>
							<td height="30" align="right" valign="middle">成立时间：</td>
							<td align="left" valign="middle">
								<input type="date" style="border:1px solid #999;" v-model="founding_time" />
								<font color="#FF0000"></font>
							</td>

						</tr>
						<tr>
							<td height="30" align="right" valign="bottom">
								<font style="color: blue" onclick="history.back()">返回</font>
							</td>
							<td align="left" valign="bottom">
								<input type="button" @click="UpdateDepartment()" value="提交" />
								<input type="reset" value="重置" /></td>
							<td>&nbsp;</td>
						</tr>
					</table>
					<h3 style="color:red;"></h3>
				</form>

			</div>
		</div>
		</div>

		<script src="../js/axios.js"></script>
		<script src="../js/vue.js"></script>
		<script>
			axios.defaults.baseURL = "http://176.55.4.113"
			const QueryDepartment = new Vue({
				el: "#UpdateDepartment",
				data: {
					department_id: '',
					department_name: '',
					department_type: '分公司',
					department_tel: '',
					department_fax: '',
					superior_department: '销售部',
					founding_time: ''
				},
				methods: {
					UpdateDepartment() {
						axios.put("/department/update", {
								department_id: this.department_id,
								department_name: this.department_name,
								department_type: this.department_type,
								department_tel: this.department_tel,
								department_fax: this.department_fax,
								superior_department: this.superior_department,
								founding_time: this.founding_time
							})
							.then(result => {
								if(result.data.status == 200) {
									console.log(result)
									alert("更新成功")
								} else {
									alert("更新失败")
								}
							})
					},
					GetDepartmentById() {
						axios.get("/department/queryById?department_id=" + this.department_id)
							.then(result => {
								if(result.data.data != null) {
									this.department_name = result.data.data.department_name
									this.department_type = result.data.data.department_type
									this.department_tel = result.data.data.department_tel
									this.department_fax = result.data.data.department_fax
									this.superior_department = result.data.data.superior_department
									this.founding_time = result.data.data.founding_time
								} else {
									alert("查询失败")
								}

							})
					}
				}
			})
		</script>
	</body>

</html>